<template lang="html">
	<div class="detailslist">
		<div class="courseDesc">
			<p class="course-title">名师精讲 2018年中级会计职称</p>
			<p class="course-like">已学习2260人  好评100%</p>
			<p class="course-price">
				<a>￥</a>
				999
			</p>
		</div>
		<div class="hr"></div>
		<!-- 老师介绍 -->
		<div class="teach-introduce">
			老师介绍
			<div class="teachOne">
				<img :src="TeachOneImg" alt="">
				<div class="teach-desc">
					<p>注册会计师,会计师,毕业于名牌高校会计学专业,十余年会计一线教学工作经验,教学经验丰富,讲课条例清晰。</p>
				</div>
			</div>
			<div class="teachOne">
				<img :src="TeachTwoImg" alt="">
				<div class="teach-desc">
					<p>全国高级会计师考前辅导专家,具有20年会计教学经验,能够结合教材实例帮助学员理解。
					</p>
				</div>
			</div>
		</div>
		<!-- 课程详情 -->
		<div class="course-detail">
			课程详情
			<p>
				小规模企业从刚开始的成立(办理工商注册登记)至建账,登账,编制财务报表,以及营改增之后的最新国、地税的纳税申报,通过各种案例与实际相结合,让学员轻松掌握所有申报软件的损伤...
			</p>
		</div>
		<!-- 咨询购买 -->
		<div class="buy">
			<img :src="referImg" alt="">
			咨询
			<router-link tag="div" to="" class="btnbuy">
				<p>立即购买</p>
			</router-link >
		</div>
	</div>
</template>
<script>
	export default{
		name:'detailslist',
		data(){
			return{
				TeachOneImg:require("../assets/img/teach1.png"),
				TeachTwoImg:require("../assets/img/teach2.png"),
			    referImg:require("../assets/icon/consult.png")
			}
		}
	}
</script>
<style lang="less" scoped>
.detailslist{
	.courseDesc{
       padding:10px 18px;
       p{
       	height:30px;
       	line-height: 30px;
       }
       .course-title{
       	 font-size: 18px;
       	 color:#000;
       }
       .course-price{
       	color:#D71E05;
       	  a{
       	  	display: inline-block;
       	  	text-align: center;
       	  	width:20px;
       	  	height:20px;
       	  	line-height: 20px;
       	  	background-color: #D71E05;
       	  	color:#fff;
       	  }
       }
	}
	.hr{
		height:10px;
		background-color: #ddd;
	}
	.teach-introduce{
        padding:10px 18px;
        font-size: 18px;
        letter-spacing: 3px;
        .teachOne{
        	height:120px;
        	div{
        		width:70%;
        		float:right;
        		padding: 20px 10px;
        		box-sizing: border-box;
        		font-size: 14px;
        		color:#000;
        	}
        }
        img{
        	width:90px;
        	margin-top: 20px;
        }
	}
	.course-detail{
		width:90%;
		padding:10px 18px;
        font-size: 18px;
        margin-bottom: 120px;
        letter-spacing: 3px;        
        p{
        	font-size: 14px;
        }
	}
	.buy{
		width:100%;
		height:50px;
		line-height: 50px;
		position:fixed;
		background-color: #fff;
		bottom: 60px;
		color: #4F8FE2;
		font-size: 18px;
		img{
			width:30px;
			padding-left: 18px;
		}
        .btnbuy{
        	float:right;
        	width:130px;
        	text-align: center;
        	background-color:#4F8FE2; 
        	color:#fff;
        }
	}
}
	
</style>